<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
    <title>欢迎光临DUZU官网</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/public.css">
    <link rel="stylesheet" href="./css/index.css">
 <script type="text/javascript"
        src="http://api.map.baidu.com/api?v=2.0&ak=Nii6U9DsnTG5fp7ElpudtyYxBiUbnfVL"></script>
    <script type="text/javascript"
        src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
    <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
    <script src="./js/jquery-1.11.3.min.js"></script>
</head>

<body>
    <!-- 头部 -->
    <header>
        <nav>
            <img src="./images/logo.png" alt="">
            <ul>
                <li><a  href="index.html">首页</a></li>
                <li>
                    <a href="./html/About.html">关于我们</a>
                    <div class="subtitle">
                        <a href="./html/Product.html">公司简介</a>
                        <a href="./html/course.html">公司历程</a>
                        <a href="./html/new.html">公司新闻</a>
                    </div>
                </li>
                <li>
                    <a href="./html/Product.html">产品介绍</a>
                    <div class="subtitle">
                        <a href="./html/Latte.html">拿铁咖啡</a>
                        <a href="./html/Mocha.html">摩卡咖啡</a>
                        <a href="./html/Cappuccino.html">卡布奇诺</a>
                    </div>
                </li>
                <li>
                    <a href="./html/Team.html">我们团队</a>
                    <div class="subtitle">
                        <a href="./html/Justin.html">贾斯汀·比伯</a>
                        <a href="./html/Puth.html">查理·普斯</a>
                        <a href="./html/Avril.html">艾薇儿·拉维尼</a>
                        <a href="./html/Swift.html">泰勒·斯威夫特</a>
                    </div>
                </li>
                <li><a href="./html/Contact.html">联系我们</a></li>
            </ul>
        </nav>
    </header>

    <!-- 轮播 -->
    <div class="banner">
    </div>

    <!-- 主体 -->
    <div class="con">
        <!-- 关于我们 -->
        <section class="about">
            <div class="title">
                <h2>关于我们</h2>
                <span>About Us</span><br>
                <img src="./images/coffee_icon.png" alt="">
            </div>
            <main>
                <div class="about_left">
                    <img src="./images/jieshao.png" alt="">
                </div>
                <div class="about_right">
                    <h3>公司简介</h3>
                    <div></div>
                    <p>二十世纪三十年代，巴西咖啡豆生产过剩， 剩余的咖啡豆只能当燃料消耗，非常可惜。 当巴
                        西政府向雀巢公司寻求咖啡豆过剩的解决方法的时候 ， 并没有意识到这最终成就了一个历久弥醇
                        的伟大的咖啡品牌。 1930年，巴西咖啡连续经历了几次大丰收，短期内难以完全销售，便向雀巢
                        求助， 求令咖啡不失香醇的长 期保存方式。 咖啡权威——马克思•莫根特尔(Max Morgenthal
                        er)立刻同他的研究 队伍着手研究，试图制造一种既可以较好保存咖啡芳香又易溶于热水的"固体咖
                        啡"。经过在雀巢瑞士实验室长达七年的不懈努力，30年代末，雀巢向市场推出速溶咖啡，“雀巢
                        咖啡”品牌创立。</p>
                    <p>1988年，雀巢通过考察确定云南适宜种植咖啡，决定支持云南省的咖啡种植。随后于1992年
                        在云南思茅地区成立咖啡农艺服务部，帮助当地发展咖啡种植业。 1997年， 雀巢公司在西双版纳
                        创建试验示范农场，从零开始，让农民得到方方面面的实际培训，大大促进了当地小粒种咖啡豆的
                        发展，并使一个产量低、质量次的咖啡豆产地发展成一个产量高、质量优且已引起全球咖啡界关注
                        的咖啡豆产地。雀巢不仅让农民通过种植咖啡获得了稳定的收入,当地农民通过向雀巢了解国际现货
                        市场价格甚至自己上网查询交易网站的价格，学会根据波动分析销售咖啡的时机。</p>
                </div>
            </main>
        </section>

        <!-- 广告语 -->
        <section class="slogan">
            <span>浓香咖啡 让你享受每一个美好的午后时光</span>
        </section>

        <!-- 产品介绍 -->
        <section class="product">
            <div class="title">
                <h2>产品介绍</h2>
                <span>Product</span><br>
                <img src="./images/coffee_icon.png" alt="">
            </div>
            <main>
                <div>
                   <img class="active" src="./images/search.png" alt="">
                    <img src="./images/latte.png" alt="">
                    <h4>拿铁咖啡</h4>
                    <span></span>
                    <p>拿铁咖啡是意大利浓缩咖啡(Espresso)与牛奶的经典混合，意大利人也很喜欢把拿铁作为早餐的饮料，带来让人难以忘怀的味道</p>
                </div>
                <div>
                    <img class="active" src="./images/search.png" alt="">
                    <img src="./images/Cappuccino.png" alt="">
                    <h4>卡布基诺</h4>
                    <span></span>
                    <p>卡布奇诺是一种加入以同量的意大利特浓咖啡和蒸汽泡沫牛奶相混合的意大利咖啡。象卡布奇诺教会的修士头巾一样，咖啡因此得名</p>
                </div>
                <div>
                    <img class="active" src="./images/search.png" alt="">
                    <img src="./images/Mocha.png" alt="">
                    <h4>摩卡咖啡</h4>
                    <span></span>
                    <p>摩卡咖啡(CafeMocha)是一种最古老的咖啡，其历史要追溯到咖啡的起源。它是浓缩咖啡、鲜奶油和牛奶混合而成，摩卡得名于有名的摩卡港</p>
                </div>
            </main>
        </section>

        <!-- 公司团队 -->
        <section class="team">
            <div class="title">
                <h2>公司团队</h2>
                <span>Our team</span><br>
                <img src="./images/coffee_icon.png" alt="">
            </div>
            <main>
                <div>
                    <img src="./images/Bieber.png" alt="">
                    <h4>贾斯汀·比伯</h4>
                    <h5>Justin Bieber</h5>
                    <a href="#" class="active">
                        <h4>贾斯汀·比伯</h4>
                        <span></span>
                        <p>
                            贾斯汀出生于1994年3月1日的加拿大安大略省伦敦的圣若...
                        </p>
                    </a>
                </div>
                <div>
                    <img src="./images/puth.png" alt="">
                    <h4>查理·普斯</h4>
                    <h5>Charlie Puth</h5>
                    <a href="#" class="active">
                        <h4>查理·普斯</h4>
                        <span></span>
                        <p>
                            贾斯汀出生于1994年3月1日的加拿大安大略省伦敦的圣若...
                        </p>
                    </a>
                </div>
                <div>
                    <img src="./images/Avril.png" alt="">
                    <h4>艾薇儿·拉维尼</h4>
                    <h5>Avril Lavigne</h5>
                    <a href="#" class="active">
                        <h4>艾薇儿·拉维尼</h4>
                        <span></span>
                        <p>
                            贾斯汀出生于1994年3月1日的加拿大安大略省伦敦的圣若...
                        </p>
                    </a>
                </div>
                <div>
                    <img src="./images/Swift.png" alt="">
                    <h4>泰勒·斯威夫特</h4>
                    <h5>Taylor Swift</h5>
                    <a href="#" class="active">
                        <h4>泰勒·斯威夫特</h4>
                        <span></span>
                        <p>
                            贾斯汀出生于1994年3月1日的加拿大安大略省伦敦的圣若...
                        </p>
                    </a>
                </div>

            </main>
        </section>

        <!-- 联系我们 -->
        <section class="contact">
            <div class="title">
                <h2>联系我们</h2>
                <span>Contact us</span><br>
                <img src="./images/coffee_icon.png" alt="">
            </div>
            <main>
                <div id="allmap">
                </div>
                <div id="result">
                </div>
                <div class="right">
                    <div>
                        <div class="pic">
                            <img src="./images/phone.png" alt="">
                        </div>
                        <div>
                            咨询热线<br>
                            <span>Information Hotline</span><br>
                            <span>重庆：+86 023-867-7848</span><br>
                            <span>( 09：30~18：30 北京时间 )</span>
                        </div>
                    </div>
                    <div>
                        <div class="pic">
                            <img src="./images/map.png" alt="">
                        </div>
                        <div>
                            公司地址<br>
                            <span>Company address</span><br>
                            <span>地址：重庆大坪龙湖时代天街3号写字楼2407室</span><br>
                            <span>( 09：30~18：30 北京时间 )</span>
                        </div>
                    </div>
                    <div>
                        <div class="pic">
                            <img src="./images/email.png" alt="">
                        </div>
                        <div>
                            公司邮箱<br>
                            <span>E-mail</span><br>
                            <span>邮箱：info@haitouglobal.com</span><br>
                            <span>( 09：30~18：30 北京时间 )</span>
                        </div>
                    </div>
                </div>
            </main>
        </section>
    </div>

    <!-- 底部 -->
    <footer>
        <main>
            <span>
                Copyright © 重庆duzu有限公司 | duzu备案号 33010602001878 号 版权所有：重庆戈登有限公司
            </span>
            <img src="./images/logo.png" alt="">
        </main>
    </footer>



    <script src="./js/public.js"></script>
    <script src="./js/index.js"></script>
    <script type="text/javascript">
        var map = new BMap.Map("allmap");
        var poi = new BMap.Point(106.491281, 29.537841);
        map.centerAndZoom(poi, 16);
        map.enableScrollWheelZoom();
        var content = '<div style="margin:0;line-height:20px;padding:2px;">' +
            '<img src="./images/product_latte.png" alt="" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>' +
            '地址：重庆市九龙坡区千锋校区<br/>电话：(010)59928888<br/>简介：千锋位于北京市海淀区西二旗地铁站附近。' +
            '</div>';

        //创建检索信息窗口对象
        var searchInfoWindow = null;
        searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, {
            title: "千锋教育",      //标题
            width: 290,             //宽度
            height: 85,              //高度
            panel: "panel",         //检索结果面板
            enableAutoPan: true,     //自动平移
            searchTypes: [
                BMAPLIB_TAB_SEARCH,   //周边检索
                BMAPLIB_TAB_TO_HERE,  //到这里去
                BMAPLIB_TAB_FROM_HERE //从这里出发
            ]
        });
        //poi = new BMap.Point(106.491281, 29.537841);
        var marker = new BMap.Marker(poi); //创建marker对象
        marker.enableDragging(); //marker可拖拽
        marker.addEventListener("click", function (e) {
            searchInfoWindow.open(marker);
        })
        map.addOverlay(marker); //在地图中添加marker
    </script>
</body>

</html>